/*遮罩层*/
.mask-layer-container{ position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0,0,0,0.6); opacity: 0; -webkit-transition: opacity 0.2s; z-index: 800;}
.mask-layer-container.show{ opacity: 1;}
/*提示框*/
.alert-layer-container{ display: -webkit-flex; display: flex; flex-direction: column; position: fixed; left: 0; right: 0; bottom: 0; background-color: #FFFFFF; height: 10rem; -webkit-transform: translateY(10.5rem); -webkit-transition: -webkit-transform 0.2s; z-index: 900;}
.alert-layer-container.show{-webkit-transform: translateY(0);}
.alert-layer-container > .alert-content{ -webkit-flex: 1; flex: 1; display: -webkit-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; font-size: 0.9rem; color: #f94048;}
.alert-layer-container > .alert-button{ display: -webkit-flex; display: flex; border-top: 1px solid #DDDDDD;}
.alert-layer-container > .alert-button > a{ -webkit-flex: 1; flex: 1; display: block; text-align: center; color: #333333; font-size: 0.9rem; line-height: 3rem; position: relative;}
.alert-layer-container > .alert-button > a:before{ content: ""; position: absolute; left: 0; top: 20%; bottom: 20%; border-left: 1px solid #DDDDDD;}
.alert-layer-container > .alert-button > a:first-child:before{ display: none;}
.alert-layer-container > .alert-button > a:active{ background-color: #F2F2F2;}
/*loading*/
.loading-layer-container{ display: -webkit-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; position: fixed; left: 0; right: 0; top: 0; bottom: 0; background-color: rgba(0,0,0,0.2); -webkit-transition: opacity 0.2s; z-index: 1200;}
.loading-layer-container > .box{ display: inline-block; background-color: #FFFFFF; position: relative; padding: 1rem; padding-left: 60px; padding-right: 20px; border-radius: 0.3rem; box-shadow: 0 0 3px 2px rgba(0,0,0,0.3);}
.loading-layer-container > .box > .content{ font-size: 0.9rem; color: #333333; line-height: 1.5rem;}
.loading-layer-container > .box > .spinner{ width: 60px; height: 50px; position: absolute; left: 0; top: 50%; margin-top: -25px; background: url(../images/loading_ico.png) center no-repeat; background-size: auto 60%; -webkit-animation: bouncedelay 1.2s infinite linear; animation: bouncedelay 1.2s infinite linear;}

@-webkit-keyframes bouncedelay {
  0% { -webkit-transform: rotate(0deg) }
  100% { -webkit-transform: rotate(360deg) }
}

@keyframes bouncedelay {
  0% { transform: rotate(0deg) }
  100% { transform: rotate(360deg) }
}

.loading-layer-container2 .box{ padding-right: 65px;}
.loading-layer-container2 .close{ display: block; width: 50px; height: 30px; position: absolute; right: 0; top: 50%; margin-top: -15px; background: url(../images/close_icon.png) center no-repeat; background-size: auto 55%; border-left: 1px solid #e1e1e1;}

